<template>
	<ly-layout>
		<template #aside>
			<ly-sidebar :is-fold="sidebarStore.isFold" />
		</template>
		<template #main>
			<ly-tools-bar v-show="route.name !== 'Home'" />
			<div class="ly-main">
				<router-view />
			</div>
		</template>
	</ly-layout>
</template>

<script name="App" lang="ts" setup>
import { useScreenStore } from './stores/screenStore';
import LyLayout from './components/LyLayout/index.vue';
import { useSidebarStore } from './stores/sidebarStore';
import { useSettingStore } from './stores/settingStore';
import LySidebar from './components/LySidebar/index.vue';

useSettingStore();
const route = useRoute();

// 侧边栏折叠状态
const screenStore = useScreenStore();
const sidebarStore = useSidebarStore();
watch(
	() => screenStore.screenSize,
	(val) => {
		if (val === 'xs' || val === 'sm') {
			sidebarStore.isFold = true;
			return;
		}
		sidebarStore.isFold = false;
	},
	{ immediate: true }
);
</script>
